﻿<!--*************************************************************************************

   Toolkit for WPF

   Copyright (C) 2007-2016 Xceed Software Inc.

   This program is provided to you under the terms of the Microsoft Public
   License (Ms-PL) as published at http://wpftoolkit.codeplex.com/license 

   For more features, controls, and fast professional support,
   pick up the Plus Edition at https://xceed.com/xceed-toolkit-plus-for-wpf/

   Stay informed: follow @datagrid on Twitter or Like http://facebook.com/datagrids

  ************************************************************************************-->
<local:DemoView x:Class="Xceed.Wpf.Toolkit.LiveExplorer.Samples.Text.Views.AutoSelectTextboxView"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:local="clr-namespace:Xceed.Wpf.Toolkit.LiveExplorer"
                 xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
                 Title="AutoSelectTextBox">
    <local:DemoView.Description>
        <Paragraph FontSize="14" FontFamily="Segoe">
           The AutoSelectTextBox allows the text content to be selected when the control get the focus. It also allows the Focus navigation behavior within the control to be affected.
        </Paragraph>
    </local:DemoView.Description>

   <StackPanel>
      <StackPanel.Resources>
         <Style TargetType="{x:Type xctk:AutoSelectTextBox}">
            <Setter Property="Margin" Value="5"/>
            <Setter Property="AutoSelectBehavior" Value="{Binding SelectedItem, ElementName=_autoSelectBehavior}"/>
            <Setter Property="AutoMoveFocus" Value="{Binding IsChecked, ElementName=_autoMoveFocus}"/>
         </Style>
      </StackPanel.Resources>

      <!-- FEATURES GROUP BOX -->
      <GroupBox Header="Features" >
         <Grid Margin="5">
            <Grid.ColumnDefinitions>
               <ColumnDefinition Width="Auto"/>
               <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <StackPanel Orientation="Horizontal" Grid.Column="0">
               <TextBlock Grid.Row="0" Grid.Column="0" Text="AutoSelectBehavior: " VerticalAlignment="Center" />
               <ComboBox Grid.Row="0" Grid.Column="1" x:Name="_autoSelectBehavior" SelectedIndex="1" Width="100" VerticalAlignment="Center">
                  <x:StaticExtension Member="xctk:AutoSelectBehavior.Never" />
                  <x:StaticExtension Member="xctk:AutoSelectBehavior.OnFocus" />
               </ComboBox>
            </StackPanel>
            <StackPanel Orientation="Horizontal" Grid.Column="1" Margin="10,0,0,0">
               <TextBlock Grid.Row="0" Grid.Column="2" Text="AutoMoveFocus:  " VerticalAlignment="Center" />
               <CheckBox Grid.Row="0" Grid.Column="3" x:Name="_autoMoveFocus" IsChecked="True" VerticalAlignment="Center"/>
            </StackPanel>
         </Grid>
      </GroupBox>

      <StackPanel>
         <TextBlock Text="Usage:" Style="{StaticResource Header}"/>
         <RichTextBox IsReadOnly="True" BorderThickness="0">
            <FlowDocument>
               <Paragraph>
                  <Bold>AutoSelectBehavior:</Bold>
                  <LineBreak/>
                  The value of the "AutoSelectBehavior" property determines whether the content of the AutoSelectTextBox will be selected or not when the control gets the focus.
                  <LineBreak/>
                  <LineBreak/>
                  <Bold>AutoMoveFocus:</Bold>
                  <LineBreak/>
                  <Italic>Effect with "MaxLength" property:</Italic>
                  <LineBreak/>
                  <LineBreak/>
                  Setting the "MaxLength" of the text box allows the focus to move from the AutoSelectTextBox once the max length has been reached.
               In the following "Telephone Number" fields, the "MaxLength" properties of the controls have been set to 3, 3, and 4.
               </Paragraph>
            </FlowDocument>
         </RichTextBox>

         <!-- PHONE NUMBER FIELDS -->         
         <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock Text="(" VerticalAlignment="Center"/>
            <xctk:AutoSelectTextBox MaxLength="3" Width="30" Text="555"/>
            <TextBlock Text=")" VerticalAlignment="Center"/>
            <xctk:AutoSelectTextBox MaxLength="3" Width="30" Text="555"/>
            <TextBlock Text="-" VerticalAlignment="Center"/>
            <xctk:AutoSelectTextBox MaxLength="4" Width="40" Text="5555"/>
         </StackPanel>
         <RichTextBox IsReadOnly="True" BorderThickness="0">
            <FlowDocument>
               <Paragraph>
                  <Italic>Effect with Arrow keys</Italic>
                  <LineBreak/>
                  <LineBreak/>
                  Setting "AutoMoveFocus" to true also allows navigating the focus through the controls using the arrow keys to move the focus up, down, left, or right. 
               You are no longer limited to the "left-right" navigation of the "Tab, Shift-Tab" keys.
               </Paragraph>
            </FlowDocument>
         </RichTextBox>

         <!-- TEXTBOX MATRIX -->
         <StackPanel Orientation="Vertical" HorizontalAlignment="Center">
            <StackPanel Orientation="Horizontal">
               <xctk:AutoSelectTextBox Text="Text1" Width="100" />
               <xctk:AutoSelectTextBox Text="Text2" Width="100"/>
               <xctk:AutoSelectTextBox Text="Text3" Width="100"/>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
               <xctk:AutoSelectTextBox Text="Text4" Width="100"/>
               <xctk:AutoSelectTextBox Text="Text5" Width="100"/>
               <xctk:AutoSelectTextBox Text="Text6" Width="100"/>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
               <xctk:AutoSelectTextBox Text="Text7" Width="100"/>
               <xctk:AutoSelectTextBox Text="Text8" Width="100"/>
               <xctk:AutoSelectTextBox Text="Text9" Width="100"/>
            </StackPanel>
         </StackPanel>
      </StackPanel>
   </StackPanel>
</local:DemoView>
